import React from 'react';
import { Col, Icon, Select } from 'antd';
import { connect } from 'dva';
import _ from 'lodash';
import {
  utils,
  BaseTable,
  SelectEditor,
  NumberView,
  InputEditor,
  TextWithTags,
} from '@/components/BaseTable';

@connect(state => ({}))
export default class AreaCellRenderer extends React.PureComponent {
  state = {};

  changeRow = value => {
    let rowData = _.cloneDeep(this.props.rowData);
    let max = 0;
    max = rowData.left_saleArea ? rowData.left_saleArea : 0;
    max += rowData.saleArea;
    let result = value;
    if (value > max) {
      result = max;
    }
    rowData = {
      ...rowData,
      saleArea: result,
    };
    const { dispatch } = this.props;
    dispatch({
      type: 'PriceManageItems/saveRows',
      payload: { rowData, category: this.props.category, isMarketing: this.props.isMarketing },
    });
  };

  render() {
    const { editing, rowData, cellData, batchAdjust } = this.props;
    let max = 0;
    max = rowData.left_saleArea && rowData.left_saleArea > 0 ? rowData.left_saleArea : 0;
    max += rowData.saleArea;

    return (
      <Col>
        {editing && rowData.canEditOther && rowData.isHouseLeaf && batchAdjust * 1 === 0 ? (
          <InputEditor
            validateStatus={rowData.errorSaleArea ? 'error' : 'success'}
            onChange={this.changeRow}
            {...this.props}
            // max={max}
            precision={2}
          />
        ) : (
          <NumberView
            valueStyle={
              editing && (rowData.errorSplitSaleArea || rowData.errorSaleArea)
                ? { color: '#ff4d4f' }
                : {}
            }
            prefix={
              editing && (rowData.errorSplitSaleArea || rowData.errorSaleArea) ? (
                <Icon type="info-circle" theme="filled" />
              ) : (
                ''
              )
            }
            {...this.props}
          />
        )}
      </Col>
    );
  }
}
